<template>
  <div>
    <el-button @click="getUserById">根据Id查询用户</el-button>
    <el-button @click="getUserById1">根据Id查询用户1</el-button>
    <el-button @click="addUser">新增用户</el-button>
    <el-button @click="addUser1">新增用户1</el-button>
    <el-button @click="delUser">根据Id删除用户</el-button>
    <h2>{{ user.username }}</h2>
    <h2>{{ user.password }}</h2>
  </div>
</template>


<script>
import axios from "axios"

export default {
  name: "C1AxiosView",
  data() {
    return {
      user: {
        username: undefined,
        password: undefined,
      },
    }
  },
  methods: {
    getUserById: function () {
      axios.get("http://localhost:8888/user/getUserById?id=2")
          .then(res => {
            this.user = res.data.data;
            this.$message({
              type: "success",
              showClose: true,
              message: "查询成功"
            })
          }).catch(err => {
        console.log(err)
      });
    },
    getUserById1: function () {
      axios({
            url: "http://localhost:8888/user/getUserById",
            method: "GET",
            params: {id: 1}
          }
      ).then(res => {
        this.$message({
          type: "success",
          showClose: true,
          message: "查询成功"
        })
      }).catch();
    },
    addUser: function () {
      axios({
        url: "http://localhost:8888/user/addUser",
        method: "POST",
        params: {name: "赵日天", age: 28, birthday: new Date()}
      }).then(res => {
        console.log(res.data);
        this.$notify({
              title: "温馨提示",
              message: "添加成功",
              type: "success"
            }
        )
      }).catch(err => {
        console.log(err);
      });
    },
    addUser1: function () {
      axios({
        url: "http://localhost:8888/user/addUser1",
        method: "post",
        data: {name: "赵日天", age: 28, birthday: "2023-10-06 15:45:00"}
      }).then(res => {
        console.log(res.data);
        this.$notify({
              title: "温馨提示",
              message: "添加成功",
              type: "success"
            }
        )
      }).catch(err => {
        console.log(err);
      });
    },
    delUser: function () {
      axios({
        url: "http://localhost:8888/user/delUserById/10",
        method: "DELETE",
      }).then(res => {
        this.$message({
          type: "success",
          showClose: true,
          message: "删除成功"
        })
      })
    }
  }
}
</script>

<style scoped>

</style>